<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <select name="" id="left" multiple='multiple'>
        <option value="0">刘备</option>
        <option value="1">张飞</option>
        <option value="2">关羽</option>
        <option value="3">小白龙</option>
    </select>
    <button onclick="move()">&gt;</button>
    <select name="" id="rigth" multiple='multiple'>
        
    </select>
    <script>
        var left=document.getElementById('left')
        var option=left.getElementsByTagName('option')
        var rigth=document.getElementById('rigth')

        function move(){
            
            for(var i=0;i<option.length;i++){
                console.log(option[i].selected)
                if(option[i].selected){
                    rigth.appendChild(option[i])
                    i--
                }
                
            }
        }
    </script>
</body>
</html>